inazuma_elevenfandomcom-20200222-history
User blog:Potassium19/Table in Wikitext
Table in Wikitext In this blog, I'll show you the basics of how to create and modify tables in wikitext. I don't have much experience in blogging so my blog may have lacks of arrangement. My knowledge on wikitext and CSS/HTML are also limited, so please don't mind my noob-ness, I'm trying my best to demonstrate how table works in wikitext to people. __TOC__ Basics Visual You can easily create a basic table by hitting the Table button in the right panel of the editor in the Visual mode. A window will pop up and you'll have to put in information about your table. Source 'Start/Ending a table, create a cell' If you need advanced options on tables, say, CSS attributes to a certain cell? You'll need to switch to source mode There, you can build a table right from the beginning and modify lots of stuffs! :To start a table, simply start with a Put a empty line between those two. We will fill in the empty spaces with our contents. Now, our code will look like this: :To make a cell (a square box) on the table, use | (Shift + \''', it's called a '''pipe).Then add the content after that. Say, I want to have a table containing one cell with sakka in it. :I'll have to start with '' '' Our result will be: You'll see that's it's absolutely nothing because we haven't put borders on and it looks like plain text. ---- 'New line' I don't want my table to have 6 cells in a row, I want it to be 3 cells in the first row and 3 cells in the second row. What can I do? Unfortunately, Enter button on your computer won't work obviously. :In wikitext, if you want to enter a new line, you'll have to use |- That's a pipe and a hyphen right after it! Now let's try creating a tablet with 3 cells on the first row saying these following: Fubuki, 9, ice And: Geounji, 10, fire on the second row :I'll have to start with Our output will be: If put in the borders, you can now see that the table is in two row: 'Adding attributes' You can customize your cells (or table) by adding attributes stuffs followed by a pipe |''' after declaring a starting of a cell (the pipe), or after declaring the starting of the table (the curly brackets and the pipe). Let me demonstrate you with an unfinished code piece: So if I run the code above, obviously it'd be an error because the attributes are my writing (except the last cell. Let's try running it: '''Advanced attributions Attribute to a cell is exactly like attribute to a div element in HTML so imagine if we want a cell to have an attribution like this: class="hey" id="thiscell" style="width:100px;color:black;background:white;" The wikitext will be like: |class="hey" id="thiscell" style="width:100px;color:black;background:white;"| Content of a cell Result: 'Merging cells' Tag: 1/8/13: I will put the borders on, since it's a bit complicated for people. But always keep in mind that the border is '''not there' for you on default'' Say, I want a cell that underneath it would be two columns instead of one. I'll have to merge 2 cells from the two columns to create one cell that underneath is two column! To do this give the cell you want to merge a colspan or rowspan Here is an initial table with 4 x 2 cells: the code is I want to merge the a'' cell down by one and merge ''b cell to the right by 2. It will look like this: The code: Note that: rowspan defines how many rows the cell will occupy. colspan defines how many colume the cell will occupy. 'Headers' Table in wikitext also uses ! (exclamation mark). It is use to make a cell to be a header cell. A header cell is a cell that has bold text and aligned center. Here's an example: Coded: ---- That is all I know about wikitext on table! All you need is imagination and logical thinking to render those imaginations onto tables when you have your idea for a table. Here's my example: Coded: Also, you need to have a basic knowledge on HTML/CSS to create a well-designed table. Category:Blog posts